<template>
    <view class="absolute xy w-100 p-box">
        <nut-button v-if="global.isWX" type="success" size="large" block open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">手机号快速登录</nut-button>
        <button v-else size="large" block class="button" open-type="getAuthorize" scope="phoneNumber" @getAuthorize="getPhoneNumberByAli">手机号快速登录</button>
    </view>
</template>

<script lang="ts" setup>
    import { authApi } from '@/api/User';
import { useGlobalStore } from '@/stores';
import { useUserStore } from '@/stores/user';
    import { hideLoading, redirectTo, showLoading, showModal, useRouter } from '@/utils/framework';
    const global = useGlobalStore()
    const user = useUserStore()
    const router = useRouter()
    const redirect = router.params.redirect || ''

    function auth(params:any) {
        showLoading()
        authApi(params).then(r => {
            hideLoading()
            if(r.success) {
                user.isAuthPhone = true
                redirectTo('./info/index?redirect=' + redirect)
            }else {
                showModal(r.msg)
            }
        })
    }

    function getPhoneNumber(e) {
        auth({code : e.detail.code, encryptedData : e.detail.encryptedData, iv : e.detail.iv})
    }

    function getPhoneNumberByAli() {
        my.getPhoneNumber({
            success: (res) => {
                auth({encryptedData : res.response})
            },
        })
    }


</script>

<style lang="scss" src="./index.scss"></style>